import { StyleSheet } from 'react-native';
import {
  APP_BLACK,
  APP_GRAY,
  APP_RED,
  APP_YELLOW
} from '../../../../constant/color';
import { phonePx } from '../../../../util/adapt';

export default StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#ffffff',
    alignItems: 'center'
  },
  content: {
    width: phonePx(295),
    height: phonePx(299),
    marginTop: phonePx(-6)
  },
  background: {
    position: 'absolute',
    left: 0,
    top: 0,
    width: phonePx(295),
    height: phonePx(299)
  },
  price: {
    marginTop: phonePx(22),
    color: APP_BLACK,
    fontSize: phonePx(20),
    fontWeight: '500',
    alignSelf: 'center'
  },
  unit: {
    fontSize: phonePx(14)
  },
  orderNumber: {
    color: APP_GRAY,
    fontSize: phonePx(12),
    marginTop: phonePx(19),
    marginLeft: phonePx(26)
  },
  time: {
    color: APP_GRAY,
    fontSize: phonePx(12),
    marginTop: phonePx(8),
    marginLeft: phonePx(26)
  },
  dash: {
    width: phonePx(234),
    marginTop: phonePx(14),
    marginLeft: phonePx(26)
  },
  dashItem: {
    width: phonePx(5),
    height: phonePx(1),
    backgroundColor: '#E8E8E8'
  },
  courseName: {
    width: phonePx(244),
    fontSize: phonePx(14),
    lineHeight: phonePx(20),
    fontWeight: '500',
    marginTop: phonePx(12),
    marginLeft: phonePx(26)
  },
  actionContent: {
    width: phonePx(257),
    height: phonePx(40),
    position: 'absolute',
    bottom: phonePx(30),
    alignSelf: 'center',
    borderRadius: phonePx(4),
    backgroundColor: APP_YELLOW,
    alignItems: 'center',
    justifyContent: 'center'
  },
  actionDesc: {
    fontSize: phonePx(14),
    fontWeight: '500',
    color: APP_BLACK
  },
  failContent: {
    backgroundColor: APP_RED
  },
  failDesc: {
    color: '#ffffff'
  },
  failDetail: {
    color: '#949AA6',
    fontSize: phonePx(16),
    lineHeight: phonePx(20),
    marginTop: phonePx(20),
    textAlign: 'center'
  }
});
